<template>
    <div>
        <h2>文章分类管理：</h2>
        <Tag  @dblclick.native='updateTag(item,index)' v-for="item in result" v-if="item.type_name!='' && !item.checked" :name="item.type_name" closable @on-close="handleClose2(item)">{{ item.type_name }}</Tag>
        <Tag v-else><input type="text" v-model="item.type_name" style="width: 80px;"><Button type="error" @click="submit(item)">提交</Button></Tag>
        <Button icon="ios-add" type="dashed" size="small" @click="handleAdd()">添加分类</Button>


        <h2 style="margin-top: 30px;">关键字管理</h2>
        <Tag  @dblclick.native='updateKey(item,index)' v-for="item in resultKey"  v-if="item.value!='' && !item.checked" :name="item.value" closable @on-close="handleClose(item)">{{ item.value }}</Tag>
        <Tag v-else><input type="text" v-model="item.value" style="width: 80px;"><Button type="error" @click="submitKey(item)">提交</Button></Tag>
        <Button icon="ios-add" type="dashed" size="small" @click="handleAddKey()">添加关键字</Button>
    </div>
</template>
<script>
    export default {
        data () {
            return {
                result:{},
                checked:false,
                is_unpadate:false,


                 resultKey:{},
                checked_key:false,
                is_update:false
            }
        },
        mounted:function(){
           this.initTag();
           this.initkeys();
        },
        methods: {
            initTag(){
                let that = this;
                this.fetch({
                    url: '/getArticleTag', //1为获取type
                    method: 'GET',
                    params: {

                    }
                }).then(function (response) {
                    if(response.data.ret==1){
                        that.result = response.data.rows;
                        that.result.forEach((item,index)=>{
                            item['checked'] = false;
                        })
                        console.log(that.result,44);
                    }

                })
            },
            handleAdd (item) {
                let content={id:'',type_name:'',checked:true};
                this.result.push(content);
            },
            handleClose2 (item) {
               let that = this;
               this.fetch({
                   url: '/deleteArticleTag',
                   method: 'GET',
                   params: {
                      id:item.id
                   }
               }).then(function (response) {
                   if(response.data.ret==1){
                      that.initTag();
                   }

               })
           },
            updateTag(item,index){
                item.checked=true;
                this.$set(this.result,index,item);

            },
            submit(item){
                if(item.id==''){
                    this.is_unpadate = false;
                }else {
                    this.is_unpadate = true;
                }
                let that = this;
                this.fetch({
                    url: '/postArticleTag',
                    method: 'post',
                    data: {
                        type_name:item.type_name,
                        id:item.id,
                        is_unpadate:this.is_unpadate
                    }
                }).then(function (response) {
                    if(response.data.ret==1){
                        that.initTag();
                        if(that.is_unpadate){
                            that.$Message.success('修改成功')
                        }else{
                            that.$Message.success('添加成功')
                        }
                    }

                })
            },

            initkeys(){
                let that = this;
                this.fetch({
                    url: '/getArticleKey', //1为获取type
                    method: 'GET',
                    params: {

                    }
                }).then(function (response) {
                    if(response.data.ret==1){
                        that.resultKey = response.data.rows;
                        that.resultKey.forEach((item,index)=>{
                            item['checked'] = false;
                        })
                    }

                })
            },

            handleAddKey (item) {
                let content={id:'',value:'',checked:true};
                this.resultKey.push(content);
            },
            handleClose (item) {
                let that = this;
                this.fetch({
                    url: '/deleteArticleKey',
                    method: 'GET',
                    params: {
                        id:item.id
                    }
                }).then(function (response) {
                    if(response.data.ret==1){
                        that.initkeys();
                    }

                })
            },

            updateKey(item,index){
                item.checked=true;
                this.$set(this.resultKey,index,item);

            },
            submitKey(item){
                if(item.id==''){
                    this.is_update = false;
                }else {
                    this.is_update = true;
                }
                let that = this;
                this.fetch({
                    url: '/postArticleKey',
                    method: 'post',
                    data: {
                        value:item.value,
                        id:item.id,
                        is_update:that.is_update
                    }
                }).then(function (response) {
                    if(response.data.ret==1){
                        that.initkeys();
                        if(that.is_update){
                            that.$Message.success('修改成功')
                        }else{
                            that.$Message.success('添加成功')
                        }
                    }

                })
            },


        }
    }
</script>